//重点指标实时监控
/* eslint-disable */
import React, { Component } from 'react';
import { connect } from 'dva';
import { Tabs, Radio } from 'antd';
import styles from './RealTime.less';
import MyTable from '../../../components/common/MyTable';
import update from 'immutability-helper';
const { TabPane } = Tabs;
class RealTime extends Component {
    constructor(props) {
        super(props);
        this.state = {
            modal1Visible: false,
            tableLoading: false,
            dataSate: [],
            params: {},
            pageSize: 10,
            pageIndex: 1,
            total: 0,
            addModal: false,
            columns: []

        }



    }
    componentDidMount() {

        let arr = [
            {
                "sub": "",
                "dataIndex": "sbbh",
                "name": "设备编号",
                "width": 100
            },
            {
                "sub": "t/h",
                "dataIndex": "a402880e96f6a0e24016f6a1176150000",
                "name": "锅炉流量",
                "width": 100
            },
            {
                "sub": "t/h",
                "dataIndex": "a402880e96f6a0e24016f6a16d09f0001a",
                "name": "锅炉给水流量",
                "width": 100
            }
        ]

        arr.forEach(item => {
            if (item.sub) {
                item.title = item.name
                item.children = [
                    {
                        title: item.sub,
                        dataIndex: item.dataIndex,
                        key: item.dataIndex,
                        width: 100,
                        align: 'center',
                        render: (text, record, index) => {

                            return (
                                <span style={{ cursor: 'pointer', color: text > 999 ? 'red' : '' }} onClick={this.onSave.bind(text, record, index)}>{text}</span>
                            )
                        }
                    }
                ]
            } else {
                item.title = item.name
            }

        });

        console.log(arr)

        this.setState({
            columns: arr
        })

        setTimeout(() => {

            let dataSate = [
                {
                    num: '清能环保',
                    glbh: '#1锅炉',
                    index: 4,
                    a402880e96f6a0e24016f6a1176150000: Math.floor(Math.random() * 60 + 950),
                    ylzbfb: Math.floor(Math.random() * 60 + 950),
                    xbcwssd: Math.floor(Math.random() * 60 + 950),
                    pywdssd: Math.floor(Math.random() * 60 + 950),
                },
                {
                    num: '清能环保',
                    glbh: '#2锅炉',
                    index: 0,
                    a402880e96f6a0e24016f6a1176150000: Math.floor(Math.random() * 60 + 950),
                    ylzbfb: Math.floor(Math.random() * 60 + 950),
                    xbcwssd: Math.floor(Math.random() * 60 + 950),
                    pywdssd: Math.floor(Math.random() * 60 + 950),
                },
                {
                    num: '清能环保',
                    glbh: '#3锅炉',
                    index: 0,
                    a402880e96f6a0e24016f6a1176150000: Math.floor(Math.random() * 60 + 950),
                    ylzbfb: Math.floor(Math.random() * 60 + 950),
                    xbcwssd: Math.floor(Math.random() * 60 + 950),
                    pywdssd: Math.floor(Math.random() * 60 + 950),
                },
                {
                    num: '清能环保',
                    glbh: '#4锅炉',
                    index: 0,
                    a402880e96f6a0e24016f6a1176150000: Math.floor(Math.random() * 60 + 950),
                    ylzbfb: Math.floor(Math.random() * 60 + 950),
                    xbcwssd: Math.floor(Math.random() * 60 + 950),
                    pywdssd: Math.floor(Math.random() * 60 + 950),
                },
                {
                    num: '再生能源',
                    glbh: '#1锅炉',
                    index: 3,
                    a402880e96f6a0e24016f6a1176150000: Math.floor(Math.random() * 60 + 950),
                    ylzbfb: Math.floor(Math.random() * 60 + 950),
                    xbcwssd: Math.floor(Math.random() * 60 + 950),
                    pywdssd: Math.floor(Math.random() * 60 + 950),
                },
            ]
            this.setState({
                dataSate
            })
        }, 1000)

    };

    onChange = () => {

    }

    onSave = (text, record, index) => {
        console.log(text, record, index)
    }


    render() {
        let width = document.body.clientWidth;
        const height = document.body.clientHeight;
        let containerHeight = '69vh';
        let tableHeight = 230;
        if (width > 1366) {
            tableHeight = 270;
            containerHeight = '69vh';
        }
        const { addModal, footerShow, modalBtnLoading, modalTitle, dataSate, tableLoading, pageSize, pageIndex, total, columns } = this.state
        return (

            <div className={styles.warp}>
                <Tabs defaultActiveKey="1" className={styles.Tabs}>
                    <TabPane tab="清能环保" key="1">
                        <Radio.Group onChange={this.onChange} defaultValue="a" style={{ paddingBottom: 16 }}>
                            <Radio.Button value="a" style={{ marginRight: 20 }}>锅炉指标</Radio.Button>
                            <Radio.Button value="b" style={{ marginRight: 20 }}>汽机指标</Radio.Button>
                            <Radio.Button value="c">环保指标</Radio.Button>
                        </Radio.Group>
                        <div style={{ height: containerHeight, overflow: 'auto', position: 'relative' }}>
                            <MyTable
                                // loading={tableLoading}
                                columns={columns}
                                // scroll={{ y: height - tableHeight, x: 2000 }}
                                dataSource={dataSate}
                                pagination={false}
                            // rowClassName={(record, index) => { return record.num === "清能环保" ? style.qnhb : style.zsny }}

                            />
                            <div style={{ height: 20 }}></div>
                            <MyTable
                                // loading={tableLoading}
                                columns={columns}
                                // scroll={{ y: height - tableHeight, x: 2000 }}
                                dataSource={dataSate}
                                pagination={false}
                            // rowClassName={(record, index) => { return record.num === "清能环保" ? style.qnhb : style.zsny }}

                            />
                        </div>

                    </TabPane>
                    <TabPane tab="再生能源" key="2">
                        Content of Tab Pane 2
                    </TabPane>
                    <TabPane tab="维尔利" key="3">
                        Content of Tab Pane 3
                    </TabPane>
                    <TabPane tab="清运公司" key="4">
                        Content of Tab Pane 3
                    </TabPane>
                </Tabs>
            </div>
        )
    }


}

export default connect()(RealTime)